<template>
  <u-popup
    mode="bottom"
    v-model="show"
    safe-area-inset-bottom
    border-radius="22"
  >
    <view class="pay-top">
      <view>{{ $t("order.methods") }}</view>
      <image @click="show = !show" :src="asyncImgs.home.close" mode=""></image>
    </view>
    <view class="pay-way">
      <view
        v-for="(type, index) in pay_type_list"
        class="pay-way-list"
        :key="index"
        @click="payway = type.payment"
        :class="payway == type.payment ? 'select-way-list' : ''"
        >{{ type.name }}
      </view>
    </view>
    <view class="confrim">
      <view @click="payOrder(order_id, payway)">{{ $t("list.confirm") }}</view>
    </view>
  </u-popup>
</template>

<script>
export default {
  data() {
    return {
      pay_type_list: [], // 支付方式
      payway: -1, // 支付方式
      template_id: [],
      show: false, // 显示支付按钮
    };
  },
  props: {
    order_id: {
      type: String,
      default: "",
    },
	url: {
	  type: String,
	  default: "",
	},
  },
  filters: {},
  created() {
    this.getOrder();
  },
  methods: {
    getOrder() {
      var query = {
        page: 1,
        status: -1,
        _from: "app",
      };
      // #ifndef APP-PLUS
      query._from = "mini";
      // #endif
      this.$allrequest.order.getList(query).then((res) => {
        if (res.code == 0) {
          if (res.data.list.length >= 1) {
            this.template_id = res.data.template_id;
            this.pay_type_list = res.data.pay_type_list;
          }
        }
      });
    },
    payOrder(order_id, pay_type) {
	  if(this.url == 'adopt_pay'){
		  this.$emit("handleConfirm", { order_id, pay_type});
		  return;
	  }
      if (pay_type < 0) {
        uni.showToast({
          title: this.$t('order.chooseMethods'),
          icon: "none",
          duration: 2000,
        });
        return false;
      }
      this.payOrderList(
        {
          order_id: order_id,
          pay_type: pay_type,
        },
        (res) => {
          return this.$allrequest.order.payData(res);
        }
      );
    },
    payOrderList(data, payData) {
      uni.showLoading({
        title: this.$t('order.pay'),
      });
      // #ifdef MP-WEIXIN
      payData({
        order_id: data.order_id,
        pay_type: data.pay_type,
        _from: "mini",
      }).then((res) => {
        uni.hideLoading();
        this.paySubmit(res, data.pay_type);
      });
      // #endif

      // #ifdef APP-PLUS
      payData({
        order_id: data.order_id,
        pay_type: data.pay_type,
        _from: "app",
      }).then((res) => {
        uni.hideLoading();
        this.paySubmit(res, data.pay_type);
      });
      // #endif
    },

    paySubmit(payData, pay_type = 0) {
      if (pay_type == 3 || pay_type == 2) {
        uni.showToast({
          title: payData.msg,
          icon: "none",
          duration: 2000,
        });
        if (payData.code > 0) {
          return false;
        } else {
          this.show = false;
          return true;
        }
      }
      if (!payData.data) {
        uni.showToast({
          title: payData.msg,
          icon: "none",
          duration: 2000,
        });
        return false;
      } else {
        const that = this;
        uni.getProvider({
          service: "payment",
          success: function (res) {
            // 微信
            if (res.provider.indexOf("wxpay") > -1 && pay_type == 1) {
              // #ifdef MP-WEIXIN
              uni.requestPayment({
                provider: "wxpay",
                orderInfo: payData.res,
                timeStamp: payData.data.timeStamp,
                nonceStr: payData.data.nonceStr,
                package: payData.data.package,
                signType: payData.data.signType,
                paySign: payData.data.paySign,
                success: function (res) {},
                complete: function (res) {
                  if (
                    "requestPayment:fail" != res.errMsg &&
                    "requestPayment:fail cancel" != res.errMsg
                  ) {
                    uni.showToast({
                      title: this.$t('order.paySuc'),
                      icon: "none",
                      duration: 2000,
                    });
                    that.show = false;
                    // 支付成功回调
                    that.$emit("paySuccess");
                  } else {
                    uni.showToast({
                      title: this.$t('order.payFail'),
                      icon: "none",
                      duration: 2000,
                    });
                  }
                },
              });
              // #endif

              // #ifdef APP-PLUS
              uni.requestPayment({
                provider: "wxpay",
                orderInfo: {
                  appid: payData.data.appid, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
                  noncestr: payData.data.noncestr, // 随机字符串
                  package: payData.data.package, // 固定值
                  partnerid: payData.data.partnerid, // 微信支付商户号
                  prepayid: payData.data.prepayid, // 统一下单订单号
                  timestamp: payData.data.timestamp, // 时间戳（单位：秒）
                  sign: payData.data.sign, // 签名，这里用的 MD5 签名
                },
                complete: function (res) {
                  if (res.errMsg.indexOf("requestPayment:fail") == -1) {
                    uni.showToast({
                      title: this.$t('order.paySuc'),
                      icon: "none",
                      duration: 2000,
                    });
                    that.show = false;
                    // 支付成功回调
                    that.$emit("paySuccess");
                  } else {
                    uni.showToast({
                      title: this.$t('order.payFail'),
                      icon: "none",
                      duration: 2000,
                    });
                  }
                },
              });
              // #endif
            }

            // 支付宝
            if (res.provider.indexOf("alipay") > -1 && pay_type == 4) {
              uni.requestPayment({
                provider: "alipay",
                orderInfo: payData.data,
                success: function (res) {},
                complete: function (res) {
                  if (res.errMsg.indexOf("requestPayment:fail") == -1) {
                    uni.showToast({
                      title: this.$t('order.paySuc'),
                      icon: "none",
                      duration: 2000,
                    });
                    that.show = false;
                    // 支付成功回调
                    that.$emit("paySuccess");
                  } else {
                    uni.showToast({
                      title: this.$t('order.payFail'),
                      icon: "none",
                      duration: 2000,
                    });
                  }
                },
              });
            }
          },
        });
      }
    },

    setShowPopup() {
      this.show = true;
    },
  },
};
</script>

<style lang="scss" scoped>
.pay-top {
  height: 109rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0rpx 36rpx;

  view {
    font-size: 36rpx;
    font-weight: bold;
  }

  image {
    width: 40rpx;
    height: 40rpx;
  }
}

.pay-tips {
  padding: 14rpx 36rpx;
  background-color: #fbf8d9;
  font-size: 24rpx;
  color: #de6a1c;
}

.pay-way {
  padding: 24rpx 36rpx;
  display: flex;
  flex-wrap: wrap;

  .pay-way-list {
    margin-right: 24rpx;
    margin-bottom: 24rpx;
    padding: 18rpx 36rpx;
    border-radius: 30rpx;
    background-color: #f2f2f2;
    font-size: 22rpx;
    color: #bfbfbf;
  }

  .select-way-list {
    padding: 16rpx 34rpx;
    border: 1rpx solid #f2270c;
    background-color: #fcedeb;
    color: #f2270c;
  }
}

.confrim {
  margin-top: 360rpx;
  padding: 12rpx 36rpx;

  view {
    width: 100%;
    height: 76rpx;
    line-height: 76rpx;
    text-align: center;
    font-size: 30rpx;
    color: #ffffff;
    background: linear-gradient(90deg, #f3150c, #f14b0c);
    border-radius: 38rpx;
  }
}
</style>
